<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8" />
	<title>积分商城</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="../css/mui.css"/>
    <link rel="stylesheet" href="../css/integral.css" />
    <link rel="stylesheet" href="../css/swiper.min.css" />
</head>
<body>
	<!--标题-->
	<header class="mui-bar mui-bar-nav">
		<a href="#">
			<img src="../images/jiantou_03.png" class="jiaotou" />
	   		<h1 class="mui-title">积分商城</h1>
		</a>
	</header>
		<!--轮播-->
	<div id="slider" class="mui-slider" >
	  <div class="mui-slider-group mui-slider-loop">
	    <!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
	    <div class="mui-slider-item mui-slider-item-duplicate">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	    <!-- 第一张 -->
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	    <!-- 第二张 -->
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	    <!-- 第三张 -->
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	    <!-- 第四张 -->
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	    <!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
	    <div class="mui-slider-item mui-slider-item-duplicate">
	      <a href="#">
	        <img src="../images/lunbo_02.png">
	      </a>
	    </div>
	  </div>
	  <div class="mui-slider-indicator">
	    <div class="mui-indicator mui-active"></div>
	    <div class="mui-indicator"></div>
	    <div class="mui-indicator"></div>
	    <div class="mui-indicator"></div>
	  </div>
	</div>
	<!--列表-->
	<ul class="mui-table-view">
	    <li class="mui-table-view-cell">
	    	<a href="#">
	    		<img src="../images/jishiben_03.png" class="exhibits" />
	    		<p class="typeface">签到</p>
	    	</a>
	    </li>
	    <li class="mui-table-view-cell">
	    	<a href="#">
	    		<img src="../images/shu_03.png" class="exhibits"  />
				<p class="typeface">优惠券</p>
	    	</a>
	    </li>
	    <li class="mui-table-view-cell">
	    	<a href="">
	    		<img src="../images/yiban_03.png"  class="exhibits" />
	    		<p class="typeface">兑换记录</p>
	    	</a>
	    </li>
	     <li class="mui-table-view-cell">
	    	<a href="">
	    		<img src="../images/yacao_03.png"  class="exhibits" />
	    		<p class="typeface">所有兑换项</p>
	    	</a>
	    </li>
	</ul>
	  <!--红墙-->
    <div class="hong">
    	<img src="../images/hong_02.png" />
    	<p><a href="#">热门悦换</a></p>
    </div>
    <!--月销两千-->
    <ul class="mui-table-view provide">
        <li class="mui-table-view-cell">
            <a class="mui-navigate-right">
                <img src="../images/yuexiao_03.png" />
                <p><a href="#">智慧养老</a></p>
                <del class="original">原价￥118:00</del>
                <span class="buying"><a href="">500</a>积分悦换</span>
                <a href="#" id="click-sign">点击签到</a>
            </a>
        </li>
        <li class="mui-table-view-cell">
            <a class="mui-navigate-right">
                <img src="../images/yuexiao_03.png" />
                <p><a href="#">智慧养老</a></p>
             	<del class="original">原价￥118:00</del>
                <span class="buying"><a href="">500</a>积分悦换</span>
                <a href="#" id="click-sign">点击签到</a>
            </a>
        </li>
        <li class="mui-table-view-cell">
            <a class="mui-navigate-right">
                <img src="../images/yuexiao_03.png" />
                <p><a href="#">智慧养老</a></p>
                <del class="original">原价￥118:00</del>
                <span class="buying"><a href="">500</a>积分悦换</span>
                <a href="#" id="click-sign">点击签到</a>
            </a>
        </li>
         <li class="mui-table-view-cell">
            <a class="mui-navigate-right">
                <img src="../images/yuexiao_03.png" />
                <p><a href="#">智慧养老</a></p>
                <del class="original">原价￥118:00</del>
                <span class="buying"><a href="">500</a>积分悦换</span>
                <a href="#" id="click-sign">点击签到</a>
            </a>
        </li>
   </ul>
	<!--mui-->
	<script src="../js/mui.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/swiper.min.js"></script>
    <script type="text/javascript">
    	mui.init();
    </script>
    <script>
    	var gallery = mui('.mui-slider');
		gallery.slider({
		  interval:3000//自动轮播周期，若为0则不自动播放，默认为0；
		});
	</script>
</body>
</html>